.common-list {
  .list-item {
    background: #fffefa;
    border-radius: 12px;
    margin-bottom: 12px;
    overflow: hidden;

    .list-header {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      padding: 16px;
      .merchant-info {
        display: flex;
        align-items: flex-start;
        flex: 1;
        .merchant-logo {
          margin-right: 12px;
          border-radius: 5px;
          .logo-container {
            border-radius: 8px;
            overflow: hidden;
          }
        }

        .merchant-details {
          flex: 1;
          display: flex;
          flex-direction: column;
          justify-content: space-between;
          height: 54px;
          
          .store-name {
            font-size: 12px;
            font-weight: 400;
            color: #7A7A7A;
            line-height: 1;
            padding-top: 4px;
          }

          .transaction-date {
            font-size: 12px;
            font-weight: 400;
            line-height: 1;
            color: #7A7A7A;
          }
        }
      }

      .category-tag {
        color: #383838;
        font-size: 12px;
        white-space: nowrap;
      }
    }

    .transaction-details {
      display: flex;
      background: #f9f9f9;
      margin: 0px 16px;
      padding: 12px 0px ;
      border-radius: 12px;

      .detail-item {
        flex: 1;
        text-align: center;

        &.savings {
          .detail-label {
            color: #1890ff;

          }

          .detail-value {
            color: #1890ff;
            text-shadow: -1px -1px 0 #ffffff, 1px -1px 0 #ffffff,
              -1px 1px 0 #ffffff, 1px 1px 0 #ffffff;
          }
        }

        .detail-label {
          font-size: 12px;
          color: #666;
          padding-bottom: 8px;
          line-height: 1;
        }

        .detail-value {
          font-size: 16px;
          line-height: 1;
          &.savings-amount {
            font-weight: 700;
          }
        }
      }
    }
  }
}
